<template>
    <el-table :data="list" style="width: 100%" v-loading="loading">
        <el-table-column prop="buy.applicantName" label="企业名称" />
        <el-table-column prop="buy.address" label="地址" />
        <el-table-column prop="buy.applicantName" label="企业名称" />
        <el-table-column label="运费单价">
            <template #default="scope">
                {{scope.row.sell.transportPrice}} 元/吨
            </template>
        </el-table-column>
        <el-table-column prop="sell.address" label="产地" />
        <el-table-column prop="sell.applicantName" label="供应单位" />
        <el-table-column label="操作" width="120">
            <template #default="scope">
                <el-button link type="primary" size="small" @click.prevent="handleClick(scope)">
                    详情
                </el-button>
            </template>
        </el-table-column>
    </el-table>
</template>

<script lang="ts" setup>
import { ref } from 'vue';
import { useRoute, useRouter } from 'vue-router';
import { ownBuyApi } from '../../../../../api/user';
import { useDetailStore } from '../../../../../store/user';
const list = ref([]);
const router = useRouter();
const detailStore = useDetailStore();
const loading = ref(false);
loading.value = true;
ownBuyApi().then(resp => {
    const { code, msg, data } = resp;
    loading.value = false;
    if (code === 200) {
        console.log(data);
        list.value = data;
    }
})

const handleClick = (item) => {
    router.push({
        name: "TransactionDetail",
        query: {
            a: 1
        },
        params: {
            id: item.row.id
        }
    })
}

</script>

<style scoped lang="less">
/deep/ .el-button {
    width: auto;
}
</style>